/*2S7LXljdWdGhrCxZ1MFl4nbo76lbmNV/zj9vAsZ4TsJjt35I/W4VBwuu/33I9fcb*/
import React, { Component } from 'react';
import { ajax, base, toast, pageTo, getMultiLang, createPage, formatNumber, formatDatetime } from 'nc-lightapp-front';
const { NCModal, NCButton, NCTable, NCDiv } = base;
import './index.less';

import { lib, utils } from '@platform/table-core';
const { getMetaIsTotal, polymerizeComponents } = utils;
const { total } = lib;
const BigDataTable = polymerizeComponents(
    NCTable,
    // 高阶组件是有顺序的
    [
        total,
    ],
    {
        name: 'financeTable',
        type: 'hoc',
        user: 'finance',
    });

class combinedExaminationModel extends Component {
	constructor(props) {
		super(props);
		this.totalData = [];
		this.table = '';
		this.total = '';
		this.state = {
			tableHeight:'200',
			tableData: [],
			record: null,
			selectedRow: [],
			json: {}
		};
	}

	componentWillMount() {
		let callback = (json) => {
			this.setState({ json: json }, () => {
				this.columns = [
					{
						title: (<div fieldid="pk_dealnum">{this.state.json['public-000045']}</div>) /* 国际化处理： 行号*/,
						dataIndex: 'pk_dealnum',
						key: 'pk_dealnum',
						width: 140,
						fixed: 'left',
						render: (text, record, index) => <div fieldid="pk_dealnum">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="jine">{this.state.json['public-000046']}</div>) /* 国际化处理： 金额*/,
						children: [
							{
								title: (<div fieldid="money">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
								dataIndex: 'money',
								key: 'money',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="money" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							},
							{
								title: (<div fieldid="local_money">{this.state.json['public-000048']}</div>) /* 国际化处理： 本币*/,
								dataIndex: 'local_money',
								key: 'local_money',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="local_money" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							}
						]
					},
					{
						title: (<div fieldid="ye">{this.state.json['public-000049']}</div>) /* 国际化处理： 余额*/,
						children: [
							{
								title: (<div fieldid="money_bal">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
								dataIndex: 'money_bal',
								key: 'money_bal',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="money_bal" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							},
							{
								title: (<div fieldid="local_money_bal">{this.state.json['public-000048']}</div>) /* 国际化处理： 本币*/,
								dataIndex: 'local_money_bal',
								key: 'local_money_bal',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="local_money_bal" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							}
						]
					},
					{
						title: (<div fieldid="scomment">{this.state.json['public-000050']}</div>) /* 国际化处理： 处理摘要*/,
						dataIndex: 'scomment',
						key: 'scomment',
						width: 140,
						// istotal: true, 
						render: (text, record, index) => <div fieldid="scomment">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="busidate">{this.state.json['public-000051']}</div>) /* 国际化处理： 处理日期*/,
						dataIndex: 'busidate',
						key: 'busidate',
						width: 140,
						render: (text, record, index) => <div fieldid="busidate">{text ? formatDatetime(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="jfjine">{this.state.json['public-000052']}</div>) /* 国际化处理： 借方处理金额*/,
						children: [
							{
								title: (<div fieldid="money_de_b">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
								dataIndex: 'money_de_b',
								key: 'money_de_b',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="money_de_b" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							},
							{
								title: (<div fieldid="local_money_de_b">{this.state.json['public-000048']}</div>) /* 国际化处理： 本币*/,
								dataIndex: 'local_money_de_b',
								key: 'local_money_de_b',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="local_money_de_b" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							}
						]
					},
					{
						title: (<div fieldid="dfjine">{this.state.json['public-000053']}</div>) /* 国际化处理： 贷方处理金额*/,
						children: [
							{
								title: (<div fieldid="money_de_h">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
								dataIndex: 'money_de_h',
								key: 'money_de_h',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="money_de_h" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							},
							{
								title: (<div fieldid="local_money_de_h">{this.state.json['public-000048']}</div>) /* 国际化处理： 本币*/,
								dataIndex: 'local_money_de_h',
								key: 'local_money_de_h',
								width: 140,
								istotal: true, 
								itemtype: 'number',
								className: 'columnRight',
								render: (text, record, index) => <div fieldid="local_money_de_h" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
							}
						]
					},
					{
						title: (<div fieldid="billTypeName">{this.state.json['public-000054']}</div>) /* 国际化处理： 对应单据类型*/,
						dataIndex: 'billTypeName',
						key: 'billTypeName',
						width: 140,
						render: (text, record, index) => <div fieldid="billTypeName">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="billno">{this.state.json['public-000055']}</div>) /* 国际化处理： 对应单据编号*/,
						dataIndex: 'billno',
						key: 'billno',
						width: 200,
						render: (text, record, index) => <div fieldid="billno">{text ? text : <span>&nbsp;</span>}</div>
					}
				];
				this.totalColumns = [
					{
						title: (<div fieldid="pk_dealnum">{this.state.json['public-000056']}</div>) /* 国际化处理： 合计*/,
						dataIndex: 'pk_dealnum',
						key: 'pk_dealnum',
						width: 140,
						fixed: 'left',
						render: (text, record, index) => <div fieldid="pk_dealnum">{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},

					{
						title: (<div fieldid="money">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
						dataIndex: 'money',
						key: 'money',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="money" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="local_money">{this.state.json['public-000048']}</div>)/* 国际化处理： 本币*/,
						dataIndex: 'local_money',
						key: 'local_money',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="local_money" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="money_bal">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
						dataIndex: 'money_bal',
						key: 'money_bal',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="money_bal" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="local_money_bal">{this.state.json['public-000048']}</div>) /* 国际化处理： 本币*/,
						dataIndex: 'local_money_bal',
						key: 'local_money_bal',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="local_money_bal" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="scomment">{this.state.json['public-000050']}</div>)/* 国际化处理： 处理摘要*/,
						dataIndex: 'scomment',
						key: 'scomment',
						width: 140,
						render: (text, record, index) => <div fieldid="scomment">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="busidate">{this.state.json['public-000051']}</div>) /* 国际化处理： 处理日期*/,
						dataIndex: 'busidate',
						key: 'busidate',
						width: 140,
						render: (text, record, index) => <div fieldid="busidate">{text ? formatDatetime(text) : <span>&nbsp;</span>}</div>
					},

					{
						title: (<div fieldid="money_de_b">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
						dataIndex: 'money_de_b',
						key: 'money_de_b',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="money_de_b" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="local_money_de_b">{this.state.json['public-000048']}</div>) /* 国际化处理： 本币*/,
						dataIndex: 'local_money_de_b',
						key: 'local_money_de_b',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="local_money_de_b" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},

					{
						title: (<div fieldid="money_de_h">{this.state.json['public-000047']}</div>) /* 国际化处理： 原币*/,
						dataIndex: 'money_de_h',
						key: 'money_de_h',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="money_de_h" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="local_money_de_h">{this.state.json['public-000048']}</div>) /* 国际化处理： 本币*/,
						dataIndex: 'local_money_de_h',
						key: 'local_money_de_h',
						width: 140,
						className: 'columnRight',
						render: (text, record, index) => <div fieldid="local_money_de_h" className='text-right'>{text ? formatNumber(text) : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="billTypeName">{this.state.json['public-000054']}</div>)/* 国际化处理： 对应单据类型*/,
						dataIndex: 'billTypeName',
						key: 'billTypeName',
						width: 140,
						render: (text, record, index) => <div fieldid="billTypeName">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid="billno">{this.state.json['public-000055']}</div>) /* 国际化处理： 对应单据编号*/,
						dataIndex: 'billno',
						key: 'billno',
						width: 200,
						render: (text, record, index) => <div fieldid="billno">{text ? text : <span>&nbsp;</span>}</div>
					}
				];
				//initTemplate.call(this, this.props);
			});
		};
		getMultiLang({ moduleId: 'public', domainName: 'arap', currentLocale: 'simpchn', callback });
	}
	componentDidMount() {
		this.props.onRef(this);
	}

	componentWillReceiveProps(nextProps) {
		
		if (nextProps.combinedExaminationData == this.props.combinedExaminationData) {
			return false;
		}
		let { tableData } = this.state;
		let totalArr = nextProps.combinedExaminationData.length == 0 ? [] : nextProps.combinedExaminationData.total;
		if (totalArr && totalArr.length > 0) {
			this.totalData = [
				{
					pk_dealnum: totalArr[0],
					money: totalArr[1],
					local_money: totalArr[2],
					money_bal: totalArr[3],
					local_money_bal: totalArr[4],
					scomment: totalArr[5],
					busidate: totalArr[6],
					money_de_b: totalArr[7],
					local_money_de_b: totalArr[8],
					money_de_h: totalArr[9],
					local_money_de_h: totalArr[10],
					billTypeName: totalArr[11],
					billno: totalArr[12]
				}
			];
		}
		this.setState(
			{
				tableData: nextProps.combinedExaminationData.length == 0 ? [] : nextProps.combinedExaminationData.list
			},
			() => {
				this.setState({
					selectedRow: new Array(tableData.length) //状态同步
				});
				
			}
		);
	}
	
	rowClassNameHandler = (record, index, indent) => {
		if (this.state.selectedRow[index]) {
			return 'selected';
		} else {
			return '';
		}
	};

	onRowClick = (record, index) => {
		let selectedRow = new Array(this.state.tableData.length);
		selectedRow[index] = true;
		this.setState({
			factoryValue: record,
			selectedRow: selectedRow,
			record: record
		});
	};

	linkBill = () => {
		let record = this.state.record;
		if (record) {
			ajax({
				url: '/nccloud/arap/arappub/linkarapbillnobtn.do',
				async: false,
				data: {
					billType: record.billType,
					pk_bill: record.pk_bill
				},
				success: (res) => {
					let data = res.data;
					if (data) {
						pageTo.openTo(data.url, data.condition);
					} else {
						toast({ color: 'warning', content: this.state.json['public-000057'] }); /* 国际化处理： 未查询到路径!*/
					}
				}
			});
		} else {
			toast({ color: 'warning', content: this.state.json['public-000014'] }); /* 国际化处理： 请选中一行数据!*/
			return;
		}
	};
    modalOpen=()=>{
		this.props.modal.show('combinedExamination','',()=>{
			// let tableHeight = '100px';
			let{tableHeight}=this.state;
			//let combinedExaminationModelId = document.getElementById('combinedExaminationModelId');
			// if (combinedExaminationModelId) {
			// 	let modal_content = combinedExaminationModelId.querySelector('.arap-link-modal')?combinedExaminationModelId.querySelector('.arap-link-modal'):false;
			// 	if (modal_content) {
			// 		tableHeight = modal_content.offsetHeight - 150 + 'px';
			// 	}
			// 	this.setState({
			// 		tableHeight
			// 	})
			// }  此处样式先注释，等后续所有适配完之后此样式再做调整
			// if (this.state.tableData.length > 0) {
			// 	let bodyArea='',totalArea='';
			// 	if(this.table!="" && this.table){
			// 		bodyArea = this.table.querySelector('.arap-link-tablebody')?this.table.querySelector('.arap-link-tablebody'):false;		
			// 	}
			// 	if(this.total!="" && this.total){
			// 		totalArea = this.total.querySelector('.arap-link-tablebody')?this.total.querySelector('.arap-link-tablebody'):false;
						
			// 	}
			// 	if(bodyArea){
			// 		bodyArea.onscroll = () => {
			// 			// 表体滚动条事件
			// 			totalArea.scrollLeft = bodyArea.scrollLeft;
			// 		};
			// 	}
				
			// 	if(totalArea){
			// 		totalArea.onscroll = () => {
			// 			//合计行滚动条事件
			// 			bodyArea.scrollLeft = totalArea.scrollLeft;
			// 		};
			// 	}
			// }
		});
	}
	modalClose=()=>{
		this.props.modal.close('combinedExamination');
	}
	closeModalEve =()=>{
		this.state.record = null;
	}
	render() {
		let { show, pk_tradetypeid, billno, modal } = this.props;
		let { tableData,tableHeight } = this.state;
		let { createModal } = modal;
		let columns = this.columns||[]
		let isTotal = getMetaIsTotal(columns);
		return (
			<div className="query-modal" >
				{createModal('combinedExamination', {
					title: this.state.json['public-000058'],/* 国际化处理： 详细处理情况查询*/
					id:"combinedExaminationModelId",
					size:'xlg',
					closeModalEve: this.closeModalEve.bind(this), //关闭按钮事件回调
					content: <div className="steps-content">
						<ul className="content-tit">
							<div className="content-tit-tit">
								<li className="tit-tradetype">
									<span>{this.state.json['public-000059']}：</span>
									{/* 国际化处理： 单据类型*/}
									<span>{pk_tradetypeid}</span>
								</li>
								<li className="tit-billno">
									<span>{this.state.json['public-000060']}：</span>
									{/* 国际化处理： 单据编号*/}
									<span>{billno}</span>
								</li>
							</div>
							<li>
								<NCButton
									fieldid="linkbill"
									className="button-primary"
									style={{ float: 'right' }}
									onClick={this.linkBill}
								>
									{this.state.json['public-000061']}
									{/* 国际化处理： 联查单据*/}
								</NCButton>
							</li>
						</ul>
						<NCDiv fieldid="ncc" areaCode={NCDiv.config.TABLE} className="table-area">
							<BigDataTable
								className="total-rows"
								totalConfig = {{
									totalColumns: this.totalColumns,
									totalData: this.totalData
								}}
								isTotal={isTotal}
								columns={columns}
								isDrag
								ref={(dom) => {
									this.table = ReactDOM.findDOMNode(dom);
								}}
								data={tableData}
								loading={false}
								onRowClick={this.onRowClick.bind(this)}
								rowClassName={this.rowClassNameHandler}
								bodyClassName='arap-link-tablebody'
								scroll={{ x: true, y: true }}
								bodyStyle={{ height:2000 }}
								inModal = {true}
							/>
						</NCDiv>
					</div>,
					showCustomBtns:true
				})}
			</div>
		);
	}
}
combinedExaminationModel = createPage({})(combinedExaminationModel);
export default combinedExaminationModel;

/*2S7LXljdWdGhrCxZ1MFl4nbo76lbmNV/zj9vAsZ4TsJjt35I/W4VBwuu/33I9fcb*/